$(function(){
    $('.nyroModal').nyroModal(); //for popup box
    jQuery('#mycarousel').jcarousel({
        vertical: true,
        scroll: 2,
        visible: 3
    });

    $('.link-venue').click(function(e){
        e.preventDefault();
        var vid = $(this).attr('vid');
        var vname = $(this).parent('li').children('div').text();
        var baseurl = $('#venue').attr('baseurl');
        
        //get description
        $.post(baseurl + '/index/getvenue', {vid : vid},
            function(data){
                document.getElementById('description').innerHTML = data; //display description
                
                $('#vname').text(vname); //change venue's name container
                changeImg(vid); //change image
                createGallery(vid,vname); //create picture gallery
                $('#vbooking #vid').val(vid); //vid for book button
                showCheckAvailable(vid) //calendar button

                $('.nyroModal1').nyroModal(); //initialize nyroModal in ajax content
            }
        );
    });
});

function changeImg(vid){
    var elm = '#display #image';
    var baseurl = $(elm).attr('baseurl');
    $(elm).html(
        "<img src='" + baseurl + "/images/venues/venue_" + vid + "_main.jpg' alt='no image' />"
    );
}

function createGallery(vid, vname){
    var elm = '#display #gallery';
    var baseurl = $(elm).attr('baseurl');
    $(elm).html(
        "<a class='nyroModal1' href='" + baseurl + "/images/venues/venue_" + vid + "_main.jpg' title='" + vname + "' rel='gal'>Pictures</a>" +
        "<a class='nyroModal1 hidden-gal' href='" + baseurl + "/images/venues/getvenue.php?vid=" + vid + "&seq=1' title='" + vname + "' rel='gal'></a>" +
        "<a class='nyroModal1 hidden-gal' href='" + baseurl + "/images/venues/getvenue.php?vid=" + vid + "&seq=2' title='" + vname + "' rel='gal'></a>" +
        "<a class='nyroModal1 hidden-gal' href='" + baseurl + "/images/venues/getvenue.php?vid=" + vid + "&seq=3' title='" + vname + "' rel='gal'></a>"
    );
}

function showCheckAvailable(vid){
    $('#frmCheck #vid').val(vid);
    $('#calendar').show();
}